/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React from 'react';
import { Col, Row } from 'antd';
import styles from './index.less';
const Index: React.FC<{
  title: string;
  options: any;
  data: any;
  array?: boolean;
}> = (props) => {
  const { title, options = [], data, array = false } = props;
  const fit1 = {
    xs: 24,
    md: 24,
    lg: 8,
    xl: 8,
    xxl: 8,
  };
  const fit = {
    xs: 24,
    md: 24,
    lg: 16,
    xl: 16,
    xxl: 16,
  };
  const fit2 = {
    xs: 12,
    md: 12,
    lg: 8,
    xl: 8,
    xxl: 8,
  };
  const role = {
    other: '其他',
    user: '用户',
    shop: '网点',
    courier: '业务员',
    admin: '管理员',
  };
  return (
    <div className={styles['list']}>
      <p className={styles['list--title']}>{title}</p>
      <div>
        {!array
          ? options.map((item: { dataIndex?: string; renderText?: Function; title: string }) => {
              const { dataIndex, renderText, title: ntitle } = item;
              return (
                <Row key={ntitle} className={styles['list--item']} justify='space-between'>
                  <Col {...fit1}>{ntitle}</Col>
                  <Col {...fit}>
                    {renderText
                      ? renderText(data, dataIndex ? data[dataIndex] : '')
                      : dataIndex && data[dataIndex]}
                  </Col>
                </Row>
              );
            })
          : data.map((item: { system: string; reason: string; create_at: string }) => {
              return (
                <Row key={item.system} className={styles['list--item']} justify='space-between'>
                  <Col {...fit2}>{role[item.system]}</Col>
                  <Col {...fit2}>{item.reason}</Col>
                  <Col {...fit2}>{item.create_at}</Col>
                </Row>
              );
            })}
      </div>
    </div>
  );
};

export default Index;
